<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
		<script src="js/jweixin-1.6.0.js.js" type="text/javascript" charset="utf-8"></script>
		<script charset="utf-8" src="https://map.qq.com/api/gljs?v=1.exp&key=HJLBZ-DQKL5-XBFI7-QEFU4-73SRS-G7FK5&libraries=geometry"></script>
		<title>地图导览</title>
		<script src="http://kfs.monkeysoftware.cn/static/front/cgwl_1.js?v=1634634171"></script>
		<script src="js/monkey.js" type="text/javascript" charset="utf-8"></script>
		<script charset="utf-8" src="https://map.qq.com/api/gljs?v=1.exp&key=HJLBZ-DQKL5-XBFI7-QEFU4-73SRS-G7FK5"></script>
		<style type="text/css">
			* {
				margin: 0px;
				padding: 0px;
				box-sizing: border-box;
			}
		
			#container {
				width: 100%;
				height: 100vh;
				overflow: hidden;
			}
		
			#bottomMenu {
				width: 100%;
				height: 40px;
				background-color: #fff;
				position: absolute;
				top: 0;
				left: 0;
				z-index: 9999;
				border: 1px solid #f5f5f5;
				display: flex;
			}
			.search{
				width: 12%;
				background: url(img/play.png) no-repeat center center;
				background-size: 65%;
			}
			.singleMenu::-webkit-scrollbar {
				display:none;
			}
			.singleMenu{
				width: 88%;
				/* padding: 12px 0 0; */
				line-height: 40px;
				overflow-x: scroll;
			}
			.bottomRender{
				width: 600px;
				display: flex;	
			}
			.allMenu{
				width: 12%;
				background: url(https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/menu.png) no-repeat center center;
				background-size: 65%;
			}
			.showAllMenu{
				position: absolute;
				width: 100vw;
				height: 0;
				background-color: #fff;
				top: 0;
				left: 0;
				transition: .5s;
				overflow: hidden;
			}
			.topClose{
				display: flex;
				justify-content: space-between;
				padding: 10px;
				color: #666;
			}

			.showAllMenuCheck{
				height: auto;
			}
			.showIcon{
				display: flex;
				flex-wrap: wrap;
			}
	
			.menuItem {
				width: 60px;
				text-align: center;
				font-size: 12px;
				color: #999;
				/* padding: 24px 0 0; */
			}
			.allMenuItem{
				width: 25%;
				height: 70px;
				line-height: 80px;
				text-align: center;
				font-size: 12px;
				color: #999;
			}
				
			.beChoice {
				color: #007AFF;
		
			}
		
			.topOpenBox {
				width: 90%;
				height: 0;
				position: absolute;
				bottom: 0;
				left: 5%;
				transition: .2s;
				z-index: 9999;
				overflow: hidden;
				background-color: #fff;
				border-radius: 10px;
				border: 1px solid #f5f5f5;
				color: #333;
			}
			.openBoxTop{
				padding: 12px 20px;
			}
			.openBoxBottom{
				border-top: 1px solid #f5f5f5;
				display: flex;
				justify-content: space-around;
				padding: .5rem 0;
			}
			.headTitle{
				font-size: 1rem;
			}
			.touristDetail{
				display: flex;
			}
			.touristDetailRight p:nth-child(1){
				margin: 5px 0;
				font-size: .8rem;
			}
			.touristDetailRight p:nth-child(2){
				text-overflow: ellipsis;
				overflow: hidden;
				display: -webkit-box;
				-webkit-box-orient: vertical;
				-webkit-line-clamp: 2;
				font-size: .8rem;
			}
			.audioBox{
				width: 6.5rem;
				height: 4rem;
				margin-left: .5rem;
				padding-top: 2.8rem;
			}
			.audioPlay{
				background: url(https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/play.png) no-repeat top center;
				background-size: 80%;
			}
			.audioParse{
				background: url(https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/pause.png) no-repeat top center;
				background-size: 80%;
			}
		
			.topTitle {
				font-size: 18px;
				padding: 2px 5px 10px;
				color: #333;
				border-bottom: 1px solid #f5f5f5;
				margin-bottom: 10px;
			}
		
			.topMain {
				display: flex;
				padding: 0 5px 5px;
			}	
			.beChoiceOpen {
				bottom: 1.5rem;
				height: auto;
				
			}
			.rotate-circle{
				/* padding: 80px 300px 7px 20px !important; */
				padding-top: 4.5rem;
			}
			.logo-text{
				display: none;
			}
			
		</style>
		
	</head>
	<body>
		<div id="container"></div>
		<div id="bottomMenu">
			<!-- <div class="search" onclick="toSearch()"></div> -->
			<div class="singleMenu">
				<div class="bottomRender"></div>
			</div>
			<div class="allMenu"></div>
			<div class="showAllMenu">
				<div class="topClose">
					<div id="">全部</div>
					<div class="closeShowMenu"><img src="https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/99-3.png" style="width: 25px;" ></div>
				</div>
				<div class="showIcon">
					
				</div>
			</div>
		</div>
		<!-- 底部弹出框 -->
		<div class="topOpenBox">
			<div class="openBoxTop">
				<div class="headTitle">龙门桥</div>
				<div class="touristDetail">
					<div class="touristDetailRight">
						<p>距你1089公里</p>
						<p>龙门桥，又称龙门石拱桥，位于伊好看哈开发好可怜卡喝咖啡拉黑好看的喝咖啡客户反馈拉回来</p>
					</div>
					<div class="audioBox audioPlay">
						<audio src="https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/1111.mp3" id="vedio1">
							当前浏览器不支持audio
						</audio>
						<span class="audioTime">shijian</span>
					</div>
				</div>
			</div>
			<div class="openBoxBottom">
				<div class="" style="display: flex;align-items: center;">
					<img src="https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/navto.png" style="width: 22px;margin-right: 5px;">
					<span>详情</span>
				</div>
			</div>
		</div>
	</body>
	<!-- 引入uniapp的webview js -->
	<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
	<script type="text/javascript">
		//获取当前地址坐标
		const userLocation=localStorage.getItem('userLocation').split(',');
		const guideMsg=JSON.parse(localStorage.getItem('guideMsg'))
		var center = new TMap.LatLng(userLocation[1], userLocation[0]);
		var mapCenter =new TMap.LatLng(26.042207,114.251352);
		//初始化地图
		var map = new TMap.Map("container", {
			zoom: 19, //设置地图缩放级别
			center: mapCenter //设置地图中心点坐标
		});
		//手绘地图放置信息
		var imageSW = new TMap.LatLng(26.041529, 114.250750);
		var imageNE = new TMap.LatLng(26.042982, 114.251855);
		var imageLatLngBounds = new TMap.LatLngBounds(imageSW, imageNE);
		var imageGroundLayer = new TMap.ImageGroundLayer({
			bounds: imageLatLngBounds,
			src: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/map.png',
			map: map
		});
		//封装计算距离函数
		var distance = 0;
		function computedDistance(userLocation,destination){
			distance = TMap.geometry.computeDistance([userLocation,destination]); 
			console.log('distance',distance);
			if(distance>=1000){
				distance=(distance/1000).toFixed(2)+'公里';
			}else{
				distance=distance.toFixed(2)+'米';
			}
			localStorage.setItem('distance',distance)
		}
		
		// 底部menu栏数据 包括marker点的数据 显示图标等
		var bottomMenu = [{
				Name: '景点', //底部menu菜单的名称
				ImgUrl: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/jingdian.png', //显示的底部icon
				clickImg: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/jingdian1.png', //选中的底部icon
				icon: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/iconJingdian.png', //地图上显示的icon
				menuArr: [{ //该menu下包含的位置信息
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042446, 114.251282),
					"properties": {
						"title": "南屏山",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img1.png',
						"introduction": '南屏山是吉安市遂川县和赣州市上犹县的分水岭，有如一道绿色屏风，矗立桃源之南；南屏山又如一条卧着的长龙，“龙抬头”轿子顶巍然矗立，“龙摆尾”绵延数十里没有豁口，贯穿湘粤赣三省的茶盐古道只得从伯公垇翻越而过',
						"detailUrl":"123212313",
						"audio":""
					}
				}, {
					"id": "marker2",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042246, 114.2513462),
					"properties": {
						"title": "遂心石",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img2.png',
						"introduction": '西坑有石如心，村民叫它“遂心石”，又叫“开心石”、“良心石”。千古奇石上长有一棵千年古柞，长得根繁叶茂，多花多子。',
						"detailUrl":"123212313",
						"audio":"https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/1111.mp3"
					}
				}, {
					"id": "marker3",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.041869, 114.251399),
					"properties": {
						"title": "风雨桥",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img1.png',
						"introduction": '该桥博取民间建筑之精华，集亭台楼阁于一身，造型优美。整座廊桥从结构上看大致可分为三大部分：桥墩、桥面、桥顶。',
						"detailUrl":"12314214",
						"audio":"https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/1111.mp3"
					}
				}],
			},
			{
				Name: '停车场',
				ImgUrl: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/tingche.png',
				clickImg: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/tingche1.png',
				icon: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/iconPart.png',
				menuArr: [{
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042382, 114.251375),
					"properties": {
						"title": "marker1",
						"img": '',
						"introduction": ''
					}
				}, {
					"id": "marker2",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042482, 114.251175),
					"properties": {
						"title": "marker2",
						"img": '',
						"introduction": '梦回田园位于邛海南岸，总面积4500亩，按功能分为五大模块，诗意和大哥覅花覅和'
					}
				}, {
					"id": "marker3",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042306, 114.251471),
					"properties": {
						"title": "marker3",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img1.png',
						"introduction": '梦回田园位于邛海南岸，总面积4500亩，按功能分为五大模块，诗意和大哥覅花覅和'
					}
				}]
			},
			{
				Name: '卫生间',
				ImgUrl: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/cesuo.png',
				clickImg: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/cesuo1.png',
				icon: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/iconCesuo.png',
				menuArr: [{
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042006, 114.251449),
					"properties": {
						"title": "卫生间1",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/.png',
						"introduction": ''
					}
				}, {
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042113, 114.251634),
					"properties": {
						"title": "卫生间2",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img2.png',
						"introduction": '',
						"detailUrl": '12341'
					}
				}]
			},
			{
				Name: '酒店',
				ImgUrl: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/jiudian.png',
				clickImg: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/jiudian1.png',
				icon: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/iconJiudian.png',
				menuArr: [{
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042034, 114.251505),
					"properties": {
						"title": "桃源梯田大酒店",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img2.png',
						"introduction": '桃源景区五星级酒店',
						"detailUrl": '12341'
					}
				}, {
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042587, 114.251189),
					"properties": {
						"title": "桃源民宿",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img1.png',
						"introduction": '桃源梯田景区最受欢迎民宿',
						"detailUrl": '12341'
					}
				}]
			},
			{
				Name: '餐饮场所',
				ImgUrl: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/canyin.png',
				clickImg: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/canyin1.png',
				icon: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/iconCanyin.png',
				menuArr: [{
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.041849, 114.251138),
					"properties": {
						"title": "桃源梯田大酒店",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img.png',
						"introduction": '桃源景区五星级酒店',
						"detailUrl": '12341'
					}
				}, {
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042413, 114.251425),
					"properties": {
						"title": "桃源民宿",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img2.png',
						"introduction": '桃源梯田景区最受欢迎民宿',
						"detailUrl": '12341'
					}
				}]
			},
			{
				Name: '娱乐会所',
				ImgUrl: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/yule.png',
				clickImg: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/yule1.png',
				icon: 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/iconYule.png',
				menuArr: [{
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042441, 114.251264),
					"properties": {
						"title": "桃源梯田大酒店",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img2.png',
						"introduction": '桃源景区五星级酒店',
						"detailUrl": '12341'
					}
				}, {
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042032, 114.251140),
					"properties": {
						"title": "桃源民宿",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img.png',
						"introduction": '桃源梯田景区最受欢迎民宿',
						"detailUrl": '12341'
					}
				}, {
					"id": "marker1",
					"styleId": 'marker',
					"position": new TMap.LatLng(26.042125, 114.251698),
					"properties": {
						"title": "桃源民宿",
						"img": 'https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/img2.png',
						"introduction": '桃源梯田景区最受欢迎民宿',
						"detailUrl": '12341'
					}
				}]
			},
		];
		
		//点击全部效果
		$('.allMenu').click(function(){
			$('.showAllMenu').addClass('showAllMenuCheck')
		});
		$('.closeShowMenu').click(function(){
			$('.showAllMenu').removeClass('showAllMenuCheck')
		})
		function renderBottomMenu(arr, num) {
			let html1 = '';
			let html2='';
			arr.forEach((item, index) => {
				if (num != '' && num == index) {
					html1 += `
					<div class="menuItem beChoice" onclick="beChoice(this,${item.Id})" data-index=${index}>${item.Name}</div>
					`;
					html2 +=`
					<div class="allMenuItem beChoice" onclick="beChoice(this,${item.Id})" style="background: url(${item.clickImg}) no-repeat center 0;background-size: 22px 22px;" data-index=${index}>${item.Name}</div>
					`
				} else {
					html1 += `
					<div class="menuItem" onclick="beChoice(this,${item.Id})" data-index=${index}>${item.Name}</div>
					`;
					html2 += `
					<div class="allMenuItem" onclick="beChoice(this,${item.Id})" style="background: url(${item.ImgUrl}) no-repeat center 0;background-size: 22px 22px;" data-index=${index}>${item.Name}</div>
					`;
				}
			});
			$('.bottomRender').html(html1);
			$('.showIcon').html(html2);
		};
		// 渲染底部数据 第二个参数为选中index guideMsg
		// renderBottomMenu(bottomMenu, '');
		renderBottomMenu(guideMsg, '');
		//获取点击坐标
		map.on("click", function(evt) {
			if($('.showAllMenu').hasClass('showAllMenuCheck')){
				$('.showAllMenu').removeClass('showAllMenuCheck');
			}
			var lat = evt.latLng.getLat().toFixed(6);
			var lng = evt.latLng.getLng().toFixed(6);
			console.log(lat, lng)
			// 点击地图移除头部框
			$('.topOpenBox').removeClass('beChoiceOpen');
			// 重新设置中心坐标
			// map.setCenter(new TMap.LatLng(lat, lng)); 
		});
		//封装请求接口
		function getMenuItem(id){
			method.PostApiUrl('/API/Article/GetList', {
			    ArticleCategoryId: id,
			    Index:1,
			    Size:40,
			}, function (data) {
				console.log('测试1231414',data);
				
			})
		};
		// 点击头部按钮
		function beChoice(e,id) {
			console.log(555,e,id)
			$('.showAllMenu').removeClass('showAllMenuCheck');
			// 点击地图移除头部框
			$('.topOpenBox').removeClass('beChoiceOpen');
			if ($(e).hasClass('beChoice') == false) {
				let choiceIndex = $(e).attr('data-index');
				//底部选中样式调整
				renderBottomMenu(guideMsg, choiceIndex);
				// 显示对应的marker集合
				getMenuItem(id);
				bottomMenu.forEach((item, index) => {
					if (index == choiceIndex) {
						// 清除之前的marker
						if (marker) {
							marker.setMap(null);
							marker = null;
						};
						// 这里的icon是地图上显示的标志
						showTypeOfMarker(item.menuArr, item.icon);
						return;
					}
				})
			} else {
				console.log('error')
			}
	
		};
		var marker = null;
		// 封装一个点击显示marker的函数
		function showTypeOfMarker(arr, icon) {
			//初始化marker
			marker = new TMap.MultiMarker({
				id: 'marker-layer', //图层id
				map: map,
				styles: { //点标注的相关样式
					"marker": new TMap.MarkerStyle({
						"width": 35,
						"height": 35,
						"anchor": {
							x: 16,
							y: 32
						},
						"src": icon
					})
				},
				geometries: arr //点标注数据数组
			});
			//监听marker点击事件
			marker.on("click", eventClick);
			showMarker(arr);
		}
		//初始化
		var bounds = new TMap.LatLngBounds();
		//设置自适应显示marker
		function showMarker(arr) {
			//判断标注点是否在范围内
			arr.forEach(function(item) {
				//若坐标点不在范围内，扩大bounds范围
				if (bounds.isEmpty() || !bounds.contains(item.position)) {
					bounds.extend(item.position);
				}
			})
			//设置地图可视范围
			map.fitBounds(bounds, {
				padding: 100 // 自适应边距
			});
		}
		var infoWindow = null;
		//marker 添加点击事件
		//监听回调函数（非匿名函数）点击marker 打开头部弹框 渲染对应数据
		var eventClick = function(evt) {
			$('.topOpenBox').addClass('beChoiceOpen');
			let lat = evt.geometry.position.toString().substring(0, 9) - 0;
			let lng = evt.geometry.position.toString().substring(11, 21) - 0;
			// 重新设置中心坐标
			map.setCenter(new TMap.LatLng(lat, lng));
			let localCenter= new TMap.LatLng(lat, lng);
			let addressName=evt.geometry.properties.title;
			console.log(evt,addressName)
			//计算距离
			computedDistance(localCenter,center)
			// 有些地址没有详情 注意
			if (evt.geometry.properties.introduction == null || evt.geometry.properties.introduction == '') {
				evt.geometry.properties.introduction = '暂无简介'
			};
			// 没有图片是默认图片
			if(evt.geometry.properties.img == null || evt.geometry.properties.img == ''){
				evt.geometry.properties.img='https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/nopic.png';
			}
			let html='';
			html=`
				<div class="openBoxTop">
					<div class="headTitle">${evt.geometry.properties.title}</div>
					<div class="touristDetail">
						<div class="touristDetailRight" onclick="toDetail()">
							<p>距你${distance}</p>
							<p>${evt.geometry.properties.introduction}</p>
						</div>
			`
			if(evt.geometry.properties.audio == null || evt.geometry.properties.audio == ''){
				html +=`
					</div>
				</div>
				<div class="openBoxBottom">
					<div class="" style="display: flex;align-items: center;" onclick="openMap(${lat},${lng})">
						<img src="https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/navto.png" style="width: 22px;margin-right: 5px;">
						<span>前往</span>
					</div>
				</div>
				`
			}else{
				html+=`
							<div class="audioBox audioPlay" id="vedio" onclick="clickToPlay()">
								<audio src=${evt.geometry.properties.audio}>
									当前浏览器不支持audio
								</audio>
								<span class="audioTime">shijian</span>
							</div>
						</div>
					</div>
					<div class="openBoxBottom">
						<div class="" style="display: flex;align-items: center;" onclick="openMap(${lat},${lng})">
							<img src="https://yjy.monkeysoftware.cn/WeiXin/Content/hybirdImg/navto.png" style="width: 22px;margin-right: 5px;">
							<span>前往</span>
						</div>
					</div>
				`
			}
			$('.topOpenBox').html(html);
		};
		//点击跳转详情
		function toDetailPage(obj) {
			console.log(1234124)
			window.open = '/pages/index/index'
		};
		//点击导航
		function navigateTo(lat, lng) {
			window.location.href='https://www.baidu.com'
	
		}
		// 去掉右边放大缩小
		$('.tmap-zoom-control').hide();
		
		//点击播放
		function clickToPlay(){
			if($('.audioBox').hasClass('audioPlay')){
				$('.audioBox').removeClass('audioPlay');
				$('.audioBox').addClass('audioParse');
				return;
			};
			if($('.audioBox').hasClass('audioParse')){
				$('.audioBox').removeClass('audioParse');
				$('.audioBox').addClass('audioPlay')
				return;
			}
		}
		// 前往详情
		function toDetail(){
			uni.webView.navigateTo({
				url:'/usercenter_subpages/detail/mapTourist'
			})
		}
		//前往地图
		function openMap(lat,lon){
			uni.webView.getEnv(function(res) {
			  console.log('当前环境：' + JSON.stringify(res));
			});
			// 获取目的地的坐标
			uni.webView.navigateTo({
				url:`/usercenter_subpages/detail/map?lat=${lat}&lon=${lon}`
			})
		}
		//搜索
		// function toSearch(){
		// 	uni.webView.navigateTo({
		// 		url:`/usercenter_subpages/userCenter/about`
		// 	})
		// }	
	</script>
</html>
